<template>
	<view class="">
		<view class="fater">
			<view v-for="(item,index) in list" :key="index"
				class="item f f-a-c f-j-b b-f b-r-15 p-20 m-t-20 m-b-20 p-b-25 p-t-25">
				<view class="left">
					<view class="nmae">
						{{item.evaluation.name}}
					</view>
					<view class="time m-t-10">
						测评时间：{{item.created_at}}
					</view>
				</view>
				<view class="mark">
					{{item.score}} <text class="mar">分</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				page: 1,
				total: '',
				list: []
			}
		},
		onShow() {
			this.initList()
		},
		onReachBottom() {
			if (this.total == this.list.length) {
				return
			}
			this.page++
			this.initList()
			console.log('123456');
		},
		methods: {
			async initList() {
				let n = await this.$api.Evaluations({
					page: this.page
				})
				this.total = n.data.total
				this.list = [...this.list, ...n.data.data]
			}
		}
	}
</script>

<style lang="scss" scoped>
	.mark {
		font-size: 44rpx;
		font-family: DIN, DIN-Medium;
		font-weight: 500;
		text-align: center;
		color: #009d85;

		.mar {
			font-size: 26rpx;
			font-family: PingFang SC, PingFang SC-Regular;
			font-weight: 400;
			text-align: center;
			color: #009d85;
		}
	}

	.left {
		.nmae {
			font-size: 28rpx;
			font-family: PingFang SC, PingFang SC-Bold;
			font-weight: 700;
			color: #333333;
		}

		.time {
			font-size: 26rpx;
			font-family: PingFang SC, PingFang SC-Medium;
			font-weight: 500;
			color: #999999;
		}
	}

	.fater {
		width: 90%;
		margin: 0 auto;
	}
</style>